<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>3D图片切换</title>
		<link rel="stylesheet" href="./style.css">
	</head>
	<body>
		<div class="container">
			<div class="header">3D图片切换</div>
			<ul class="imgList" id="list">
				<li style="transition: all 0.8s ease 0ms; transform: rotateX(-90deg);">
					<a href="javascript:;" style="background-image: url(img/ty001.jpg);"></a>
					<a href="javascript:;" style="background-image: url(img/ty002.jpg);"></a>
					<a href="javascript:;" style="background-image: url(img/ty003.jpg);"></a>
					<a href="javascript:;" style="background-image: url(img/ty004.jpg);"></a>
				</li>
			</ul>
			<div class="btns" id="btns">
				<div class="active">1</div>
				<div>2</div>
				<div>3</div>
				<div>4</div>
			</div>
		</div>
		<script src="./index.js"></script>
	</body>
</html>
